@import "../lib/px2rem.scss";

aside{
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	.example-enter{				
		width:0;
		transition: all 300ms ease;        
	}	
	.example-enter-active{
		width:100%;
		transition: all 5000ms ease;
	}     
	.example-leave{
		width:100%;
		transition: all 300ms ease;        
	}	
	.example-leave-active{
		width:0;
		transition: all 300ms ease;        
	}	
	.aside_content{
		top:px2rem(50);
		left:0;
		right:0;
		bottom:0;
		position:absolute;
    	display:flex;
		.aside_list{
			width:px2rem(210);
			height:100%;
			background:#282828;
			border-top: px2rem(1) solid #222;
    		box-shadow: 0 px2rem(1) px2rem(1) #363636 inset;
			li{
				height:px2rem(50);
				padding-left:px2rem(16);
				padding-right:px2rem(16);
				line-height:px2rem(50);
				border-bottom:px2rem(1) dotted #333;
				color:#9a9a9a;
				display:block;
				a{
					display:block;
					height:100%;
					font-size:px2rem(14);
					color:#9a9a9a;
					span{
						float:left;
					}
					i{
						float:right;
						font-size:px2rem(18);
						color:#4f4f4f;
					}
				}
			}
		}
		.aside_opacity{
			flex:1;
			background:#282828;
			opacity:0.3;
		}
	}
}